<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>确认订单</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script src="js/rem.js"></script> 
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css/base.css"/>
    <link rel="stylesheet" type="text/css" href="css/page.css"/>
    <link rel="stylesheet" type="text/css" href="css/all.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loading.css"/>
    <link rel="stylesheet" type="text/css" href="slick/slick.css"/>
	<style>
		.hiddenDiv{
			display: none;
		}
		.alertMessageBg{
			position:absolute;
			width:100%;
			height:100%;
			left:0;
			top:0;
			background:#fff;
			z-index:97;
		}
	</style>
<script type="text/javascript">
	$(function () {
		var cidStr = location.search.substr(6);
		var url=baseUrl+ "/zuul-cart/carts/findByCids?cids="+cidStr;
		$.get(url,{uid:localStorage.getItem('uid')},function(result){
			$("#body").empty();
			if(result.resultCode="1000"){
				var content="";
				var lists=result.data;
				var totalNum=0;
				var totalPrice=0;
				for(var i=0;i<lists.length;i++){
					content+='<div class="lie clearfloat" >';
					content+='<div class="tu clearfloat fl">';
					content+="<img src= "+lists[i].image+">";
					content+='</div><div class="right clearfloat fl"><p class="tit over">';
					content+=lists[i].title;
					// content+='</p><p class="fu-tit">';
					// content+=lists[i].title;
					content+='</p><div class="xia clearfloat"> <p class="jifen fl over">';
					content+=lists[i].realPrice;
					content+='</p><span class="fr db">×'
					content+=lists[i].num;
					content+='</span></div></div></div>';
					totalNum+=lists[i].num;
					totalPrice+=lists[i].num*lists[i].realPrice;
				}
				$("#body").append(content);
				$("#totalNum").text(totalNum);
				$("#totalPrice").text(totalPrice);
				localStorage.setItem('totalPrice',totalPrice);
			}else{
				alert(result.message);
			}
		})

		$.post(baseUrl+ "/zuul-address/addresses/list",{uid:localStorage.getItem('uid')},function(result) {
			if (result.resultCode = "1000") {
				$("#addId").val(result.data[0].aid);
				$("#shr").html("收货人："+result.data[0].name+"&nbsp;"+result.data[0].phone);
				$("#shdz").html("收货地址："+result.data[0].provinceName+result.data[0].cityName
								+result.data[0].areaName+result.data[0].address);

				var lists = result.data;
				var content="";
				$("#main").empty();
				for(var i =0;i<result.data.length;i++){
					content+='<div class="addlist clearfloat" onclick="changeAddress('+lists[i].aid+')"><div class="top clearfloat box-s">';
					content+='<ul><li><span class="fl">';
					content+=lists[i].name;
					content+='</span><span class="fr">';
					content+=lists[i].phone;
					content+='</span></li><li><span>';
					if(lists[i].isDefault==1){
						content+="[默认地址]";
					}
					content+=lists[i].provinceName+lists[i].cityName+lists[i].areaName+lists[i].address;
					content+='</span</li></ul></div></div>';
				}
				$("#main").append(content);
			}
		})

	})

	function chooseAddress(){
		$("#hiddenDiv").removeClass("hiddenDiv");
		$("#hiddenDiv").addClass("alertMessageBg");
	}

	function closeDiv(){
		$("#hiddenDiv").removeClass("alertMessageBg");
		$("#hiddenDiv").addClass("hiddenDiv");
	}

	function changeAddress(id){
		var url=baseUrl+"/zuul-address/addresses/findByAid";
		
		$.post(url,{aid:id},function(result){
			if(result.state=="1000"){
				$("#hiddenDiv").removeClass("alertMessageBg");
				$("#hiddenDiv").addClass("hiddenDiv");
				$("#addId").val(result.data.addressId);
				$("#shr").html("收货人："+result.data.name+"&nbsp;"+result.data.phone);
				$("#shdz").html("收货地址："+result.data.provinceName+result.data.cityName
						+result.data.areaName+result.data.address);
			}else{
				alert(result.message);
			}
		})
	}

	function submitOrder() {
		$.post(baseUrl+"/zuul-order/orders/create",
				{"cids":location.search.substr(6),
					"aid":$("#addId").val(),
					uid:localStorage.getItem('uid'),
					username:localStorage.getItem('username')},
				function(result){
					if(result.state=="1000"){
						alert("订单提交成功！")
						location.replace("submit-order.html?id="+result.data);
					}else{
						alert(result.message);
					}
				})
	}
</script>
</head>
<!--loading页结束-->
	<body>
		<!--header star-->
		<header class="mui-bar mui-bar-nav" id="header">
			<a class="btn" href="javascript:history.go(-1)">
	            <i class="iconfont icon-fanhui"></i>
	        </a>
	        <div class="top-sch-box top-sch-boxtwo flex-col">
	                      确认订单
	        </div>
	    </header>
	    <!--header end-->
	    
	    <div class="warp warptwo clearfloat">
	    	<div class="confirm clearfloat">
	    		<div class="add clearfloat box-s">
	    			<a href="#" onclick="chooseAddress()">
		    			<div class="left clearfloat fl">
		    				<i class="iconfont icon-dizhi1"></i>
		    			</div>
		    			<div class="middle clearfloat fl">
							<input id="addId" type="hidden">
		    				<p class="tit" id="shr">
		    				</p>
		    				<p class="fu-tit over2" id="shdz">
		    				</p>
		    			</div>
		    			<div class="left clearfloat fr">
		    				<i class="iconfont icon-jiantou1"></i>
		    			</div>
	    			</a>
	    		</div>
				<div id="body">
				</div>
		     	<div class="gmshu gmshutwo clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl">配送方式</p>
			     		<div class="you clearfloat fr">
			     			<span>快递 免邮</span>
			     			<i class="iconfont icon-jiantou1"></i>
			     		</div>
					</div>		     		
		     	</div>
		     	<div class="gmshu gmshutwo clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl">发票信息</p>
			     		<div class="you clearfloat fr">
			     			<div class="xuan clearfloat">
			     				<div class="radiotwo" > 
								    <label>
								        <input type="radio" name="fapiao" value="" checked="true"/>
								        <div class="option"></div>
								        <span class="opt-text" >需要发票</span>
								    </label>
								</div>
			     			</div>
		    				<div class="xuan clearfloat">
			     				<div class="radiotwo" > 
								    <label>
								        <input type="radio" name="fapiao" value="" />
								        <div class="option"></div>
								        <span class="opt-text">不需要发票</span>
								    </label>
								</div>
			     			</div>
			     		</div>
					</div>		     		
		     	</div>
		     	<div class="gmshu gmshuthree clearfloat box-s fl">
					<div class="gcontent clearfloat">
						<p class="fl">买家留言</p>
			     		<div class="you clearfloat fl">
			     			<input type="text" name="" id="" value="" class="text" placeholder="选填 对本次交易需求给商家留言" />
			     		</div>
					</div>		     		
		     	</div>
	    	</div>
	    </div>	    
	    
		<!--settlement star-->
	    <div class="settlement clearfloat">
	    	<div class="zuo clearfloat fl box-s">
	    		共<span id="totalNum">0</span>件  总金额：￥<span id="totalPrice">0</span>
	    	</div>
	    	<a href="#" class="fl db" onclick="submitOrder()">
	    		提交订单
	    	</a>
	    </div>
	    <!--settlement end-->
	    
		<!--footer star-->
	    <footer class="page-footer fixed-footer" id="footer">
			<ul>
				<li>
					<a href="index.html">
						<i class="iconfont icon-shouye"></i>
						<p>首页</p>
					</a>
				</li>
				<li>
					<a href="cation.html">
						<i class="iconfont icon-icon04"></i>
						<p>分类</p>
					</a>
				</li>
				<li class="active">
					<a href="shopcar.html">
						<i class="iconfont icon-gouwuche"></i>
						<p>购物车</p>
					</a>
				</li>
				<li>
					<a href="login.html">
						<i class="iconfont icon-yonghuming"></i>
						<p>我的</p>
					</a>
				</li>
			</ul>
		</footer>
		<!--footer end-->

	<div id="hiddenDiv" class="hiddenDiv">
		<header class="mui-bar mui-bar-nav">
			<a class="btn" href="#" onclick="closeDiv()">
				<i class="iconfont icon-fanhui"></i>
			</a>
			<div class="top-sch-box top-sch-boxtwo flex-col">
				确认订单
			</div>
		</header>
		<div id="main" class="mui-clearfix add-address choice-address">

		</div>
	</div>
	</body>
	<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
	<script src="js/mui.min.js"></script>
	<!-- <script src="js/others.js"></script> -->
	<script type="text/javascript" src="js/hmt.js" ></script>
	<script src="slick/slick.js" type="text/javascript" ></script>
	<!--插件-->
	<link rel="stylesheet" href="css/swiper.min.css">
	<script src="js/swiper.jquery.min.js"></script>
</html>
